<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
        <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />        
        <script type="text/javascript" src="../js/jquery.min.js"></script>
        <script src="../js/qrcode.min.js"></script>
        <!-- <script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
        <link href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"> -->
        <script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
        <link rel="stylesheet" href="../mycss/main.css"/>
        <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css" media="screen"/>
        <div th:include="header :: header"/>
<!-- AJAX请求订单的支付状态 -->
<script th:inline="javascript">
$(document).ready(function(){
	<!-- 页面一旦加载完成，就向订单发状态请求 -->
	var tradeNo = [[${tradeNo}]];
	var userId = [[${userId}]];
	var url = "http://58.87.74.194:9090/success" + "?userId=" + userId;
	var jsonData;
	var sendData={};
	sendData.method="find";
	sendData.dbName="test";
	sendData.tabName="order";
	var order={};
	order.orderId=tradeNo;
	sendData.order=order;

		<!-- 延时 -->
		var pid = window.setInterval(function () {
			$.post("http://119.29.242.75:3002/db",
	                {
	                  "data": JSON.stringify(sendData)
	                },
	                function(data){
	                  jsonData = data;
	                  jsonObj = JSON.parse(jsonData);
	                  if (jsonObj[0].orderStatus == 2) {
	                	  window.clearInterval(pid);
	                      window.location.replace(url);
	                  }
	                  
	        });
        }, 3000);
 
});
</script>

</head>
    <body> 
    <style type="text/css" >
        .div1{
            position: relative;
            width: auto;
        }
        #qrcode{
            position: absolute;
            left:110px;
            top:220px;
        }
        .img2{
            width:auto; 
            max-width:100%; 
        }
    
    </style>
    
    <div class="div1">
            <img class="img2" src="https://s1.ax1x.com/2018/03/16/95bhrV.png"/>
            <div id="qrcode" ></div>           
    </div>
    
        <script th:inline="javascript">
            (function(){
                var url = [[${code_url}]];
                /* new QRCode(document.getElementById('qrcode'), url); */
                var qrcode = new QRCode('qrcode', { 
                      text: url, 
                      width: 120, 
                      height: 120, 
                      colorDark : '#000000', 
                      colorLight : '#ffffff', 
                      correctLevel : QRCode.CorrectLevel.H 
                    });
            }
            )();
        </script>
    </body>
</html>